<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>背景属性</title>
		<style>
			bo dy{
				width: 100%;
				height: 1000000px;
				background-image: url(img/fa2c1c60b3ba4950bd3456a6adbc1c40.png);
				background-size: cover;
				/* 函数  cover 等比例放大图片 特点：原图按照比例放大存背景空间
						【开发者：背景图大小是否等于背景空间】
					contain等比例缩放图片    特点：图片按照比例缩放背景空间
						【开发者：背景图等比例显示在背景空间】
				 */
				/* 背景附件：尺寸中存在cover或者contain */
				background-attachment: fixed;/* 背景图固定  scroll 不固定 */
				
			}
			div{
				width: 300px;
				height: 300px;
				background-color: #e4393c;
				background: #ffff00;
				background-image: url(img/fa2c1c60b3ba4950bd3456a6adbc1c40.png);
				/* 问题：超大图-不显示   小图-显示 
				注意：背景空间大小，如果小于背景空间--平铺
				*/
				background-repeat: no-repeat;
				/* no-repeat不平铺  repeat-x,y  横纵向平铺 */
				background-size: 30%;
				/* 背景尺寸属性值：数值px % |函数  cover contain */
				/* 背景定位：前提背景空间大于背景图  关键字：center、left、right、top */
				background-position: 80% 0;
			}
			
		</style>
	</head>
	<body>
		Lorem ipsum dolor, sit amet consectetur adipisicing elit. Consectetur vitae dolor animi eos esse. Autem fuga magnam consequuntur consectetur, laboriosam quas possimus esse nesciunt officia repellendus veniam cum nemo deserunt?
		Lorem ipsum dolor sit amet consectetur adipisicing elit. Quas quam itaque hic perspiciatis accusantium quibusdam perferendis iusto odit ratione molestiae molestias velit eos, rem asperiores vero autem dolores numquam rerum.
		Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quisquam iusto cumque aut ab sapiente. Adipisci numquam atque sit nihil modi dolorem harum aut laudantium, fugit amet fugiat aliquid, alias aliquam!
		
		<!-- html  img图片  引入一张图片  位置不可随意改变
		 css  背景图   引入一张图片，位置可以随意改变
		   子属性  background-color  背景颜色
		          background-image  背景图
				  background-repeat 背景重复
				  background-size 背景尺寸
				  background-attachment 背景附件
				  backgrount-position 背景定位
			符合属性  background :background-image  background-color backgrount-position
								background-size  background-repeat  background-attachment
			简写属性：background：background-image background-positiion | background-size background-repeat|attachment
			替代子属性background-image background-color、background-repeat-->
		<div></div>
	</body>
</html>